<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            border: 1px solid  red;
        }
        #div1{
            width:200px;
            height: 200px;
        }
        #div2{
            width: 50px;
            height: 50px;
        }
        #div3{
            width: 60px;
            height: 60px;
        }

    </style>
</head>
<body>.
<div id="div1">
    <!--创建div标签-->
    div1<div  id="div2">  div2</div>
    <!--创建div标签2-->

</div>
<a  href="java:void(0)" id="a"> 删除节点</a>
<!--创建超链接标签，删除节点-->
<a href=""   id="b">  增加节点</a>
<!-- 创建超链接标签，增加节点-->
<script>
      var a = document.getElementById("a");
      //获取超链接删除节点标签对象
      a.onclick=function(){
          //绑定事件
          var div1 = document.getElementById("div1");//获取标签div1标签对象
           var div2 = document.getElementById("div2");//获取div2标签对象
             div1.removeChild(div2);//调用node对象中个remove方法将div2标签从div1标签中移除
      }
      var b = document.getElementById("b");
      //获取超链接增加节点标签对象
      b.onclick=function(){
          //给超链接增加标签绑定事件
          var div1 = document.getElementById("div1");//获取div1标签对象
            var div3 = document.createAttribute("div");//使用document对象中个createAttribute设置一个div标签
               div3.setAttribute("id","div3");//再使用setAttribute方法给这个div标签设置id
                 div1.appendChild(div3);//使用node对象中的appendChild方法将标签div3添加到div1 中去
      }

</script>
</body>
</html>